--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Node / ReticulumProjects / MeshChatX.git / files / meshchatx / src / frontend / components / map / internal / MapClusterPanel.vue
Displaying Raw • Download
meshchatx/src/frontend/components/map/internal/MapClusterPanel.vue ec74a2651e897325b14269ae52d11b1e12f0b6e2 (ec74a265) Text, 3.68 KB
T8b949e<!-- SPDX-License-Identifier: 0BSD -->
Tb4b4b4<Tff7b72templateTb4b4b4>
Tb4b4b4<Tff7b72div
Te6edf3classTff7b72=Ta5d6ff"absolute bottom-4 left-4 right-4 sm:left-4 sm:right-auto sm:w-80 md:max-lg:w-72 lg:w-80 z-20 bg-white dark:bg-zinc-900 rounded-xl shadow-2xl border border-gray-200 dark:border-zinc-800 overflow-hidden text-gray-900 dark:text-zinc-100"
Tb4b4b4>
Tb4b4b4<Tff7b72div Te6edf3classTff7b72=Ta5d6ff"p-4 border-b border-gray-200 dark:border-zinc-800 flex items-center justify-between"Tb4b4b4>
Tb4b4b4<Tff7b72div Te6edf3classTff7b72=Ta5d6ff"flex items-center gap-3"Tb4b4b4>
Tb4b4b4<Tff7b72div
Te6edf3classTff7b72=Ta5d6ff"size-8 rounded-full flex items-center justify-center bg-blue-600 text-white text-sm font-bold"
Tb4b4b4>
Tff7b72{{ Te6edf3clusterTb4b4b4.Te6edf3count Tff7b72}}
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tff7b72divTb4b4b4>
Tb4b4b4<Tff7b72h3 Te6edf3classTff7b72=Ta5d6ff"font-bold text-gray-900 dark:text-zinc-100"Tb4b4b4>Tff7b72{{ Te6edf3clusterTb4b4b4.Te6edf3count Tff7b72}} interfaces hereTb4b4b4<Tb4b4b4/Tff7b72h3Tb4b4b4>
Tb4b4b4<Tff7b72div Te6edf3classTff7b72=Ta5d6ff"text-[10px] font-mono text-gray-500 uppercase tracking-tighter"Tb4b4b4>
Tap an item to focus
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tff7b72button
Te6edf3classTff7b72=Ta5d6ff"text-gray-500 hover:text-gray-700 dark:hover:text-zinc-300 p-1"
Te6edf3titleTff7b72=Ta5d6ff"Close"
Tb4b4b4@Te6edf3clickTff7b72=Ta5d6ff"Te6edf3$emitTb4b4b4(Ta5d6ff'close'Tb4b4b4)Ta5d6ff"
Tb4b4b4>
Tb4b4b4<Tff7b72v-icon Te6edf3iconTff7b72=Ta5d6ff"mdi-close" Te6edf3sizeTff7b72=Ta5d6ff"20"Tb4b4b4>Tb4b4b4<Tb4b4b4/Tff7b72v-iconTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72buttonTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tff7b72div Te6edf3classTff7b72=Ta5d6ff"max-h-72 overflow-y-auto divide-y divide-gray-100 dark:divide-zinc-800"Tb4b4b4>
Tb4b4b4<Tff7b72button
Te6edf3v-forTff7b72=Ta5d6ff"Tb4b4b4(Te6edf3itemTb4b4b4, Te6edf3idxTb4b4b4) Tff7b72in Te6edf3clusterTb4b4b4.Te6edf3itemsTa5d6ff"
Tb4b4b4:Te6edf3keyTff7b72=Ta5d6ff"Te6edf3idxTa5d6ff"
Te6edf3classTff7b72=Ta5d6ff"w-full flex items-center gap-3 px-4 py-2 text-left hover:bg-gray-50 dark:hover:bg-zinc-800 transition-colors"
Tb4b4b4@Te6edf3clickTff7b72=Ta5d6ff"Te6edf3$emitTb4b4b4(Ta5d6ff'select'Tb4b4b4, Te6edf3itemTb4b4b4)Ta5d6ff"
Tb4b4b4>
Tb4b4b4<Tff7b72div
Te6edf3v-ifTff7b72=Ta5d6ff"Te6edf3itemTb4b4b4.Te6edf3kind Tff7b72=== Ta5d6ff'discovered'Ta5d6ff"
Te6edf3classTff7b72=Ta5d6ff"size-7 rounded-full flex items-center justify-center border-2 border-emerald-500 bg-emerald-50 text-emerald-600 shrink-0"
Tb4b4b4>
Tb4b4b4<Tff7b72MaterialDesignIcon Tb4b4b4:Te6edf3icon-nameTff7b72=Ta5d6ff"Te6edf3getDiscoveredIconNameTb4b4b4(Te6edf3itemTb4b4b4.Te6edf3iconKeyTb4b4b4)Ta5d6ff" Te6edf3classTff7b72=Ta5d6ff"size-[14px]" Tb4b4b4/Tb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tff7b72div
Te6edf3v-else-ifTff7b72=Ta5d6ff"Te6edf3itemTb4b4b4.Te6edf3kind Tff7b72=== Ta5d6ff'telemetry'Ta5d6ff"
Te6edf3classTff7b72=Ta5d6ff"size-7 rounded-full flex items-center justify-center border-2 border-blue-500 bg-blue-50 text-blue-600 shrink-0"
Tb4b4b4>
Tb4b4b4<Tff7b72v-icon Tb4b4b4:Te6edf3iconTff7b72=Ta5d6ff"Ta5d6ff'mdi-' Tff7b72+ Tb4b4b4(Te6edf3itemTb4b4b4.Te6edf3peerTff7b72?Tb4b4b4.Te6edf3lxmf_user_iconTff7b72?Tb4b4b4.Te6edf3icon_name Tff7b72|| Ta5d6ff'account'Tb4b4b4)Ta5d6ff" Te6edf3sizeTff7b72=Ta5d6ff"14"Tb4b4b4>Tb4b4b4<Tb4b4b4/Tff7b72v-iconTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tff7b72div
Te6edf3v-else
Te6edf3classTff7b72=Ta5d6ff"size-7 rounded-full flex items-center justify-center border-2 border-gray-400 bg-gray-50 text-gray-500 shrink-0"
Tb4b4b4>
Tb4b4b4<Tff7b72v-icon Te6edf3iconTff7b72=Ta5d6ff"mdi-help" Te6edf3sizeTff7b72=Ta5d6ff"14"Tb4b4b4>Tb4b4b4<Tb4b4b4/Tff7b72v-iconTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tff7b72div Te6edf3classTff7b72=Ta5d6ff"min-w-0 flex-1"Tb4b4b4>
Tb4b4b4<Tff7b72div Te6edf3classTff7b72=Ta5d6ff"text-sm font-medium truncate"Tb4b4b4>Tff7b72{{ Te6edf3itemTb4b4b4.Te6edf3label Tff7b72}}Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tff7b72div Te6edf3v-ifTff7b72=Ta5d6ff"Te6edf3itemTb4b4b4.Te6edf3identifierTa5d6ff" Te6edf3classTff7b72=Ta5d6ff"text-[10px] font-mono text-gray-500 truncate"Tb4b4b4>
Tff7b72{{ Te6edf3itemTb4b4b4.Te6edf3identifier Tff7b72}}
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tff7b72v-icon Te6edf3iconTff7b72=Ta5d6ff"mdi-chevron-right" Te6edf3sizeTff7b72=Ta5d6ff"16" Te6edf3classTff7b72=Ta5d6ff"text-gray-400 shrink-0"Tb4b4b4>Tb4b4b4<Tb4b4b4/Tff7b72v-iconTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72buttonTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72templateTb4b4b4>
Tb4b4b4<Tff7b72scriptTb4b4b4>
Tff7b72import Te6edf3MaterialDesignIcon Tff7b72from Ta5d6ff"../../MaterialDesignIcon.vue"Tb4b4b4;
Tff7b72import Tb4b4b4{ Te6edf3getDiscoveredIconName Tb4b4b4} Tff7b72from Ta5d6ff"./discoveredIcons.js"Tb4b4b4;
Tff7b72export Tff7b72default Tb4b4b4{
Te6edf3nameTff7b72: Ta5d6ff"MapClusterPanel"Tb4b4b4,
Te6edf3componentsTff7b72: Tb4b4b4{ Te6edf3MaterialDesignIcon Tb4b4b4}Tb4b4b4,
Te6edf3propsTff7b72: Tb4b4b4{
Te6edf3clusterTff7b72: Tb4b4b4{
Te6edf3typeTff7b72: Tffa657ObjectTb4b4b4,
Te6edf3requiredTff7b72: Tff7b72trueTb4b4b4,
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4,
Te6edf3emitsTff7b72: Tb4b4b4[Ta5d6ff"close"Tb4b4b4, Ta5d6ff"select"Tb4b4b4]Tb4b4b4,
Te6edf3methodsTff7b72: Tb4b4b4{
Te6edf3getDiscoveredIconNameTb4b4b4,
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4;
Tb4b4b4<Tb4b4b4/Tff7b72scriptTb4b4b4>
──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────